/**
 * @author caojj
 * @version 1.0.3.9
 * @description 输入前提示控件
 * 
 * @require [Misc.Coord]
 * 
 * 
 * @usage
 * 			...
 * 			doms.input = document.getElementById("prof_onlineGame");
 * 			var pi = new FWK.UI.PromptInput(null,  doms, "itmOv", "itmOt", "ddaDown", "ddaUp");
 *			pi.renderTo(document.getElementById("testcot"));
 *			pi.getDDList().className = "ddList";
 *			pi.getDDList().getControl().appendChild(clostBtn);
 *		
 *
 *			pi.$listPromptData = function(value) {
 *				...
 *				//var itemCot = pi.getDDList().getItemCot();
 *				//var listItem = new FWK.UI.PromptInput.Item(text, text, itemCot);
 * 				pi.$addDDListItem(text, text);
 *				...
 *			}
 */

/*
 * 定义命名空间
 */
try {
	if(!FWK.UI){
		throw "ns";
	}
} catch (ex) {
	try{FWK}catch(e){FWK={}}
	FWK.UI = {}
}

/**
 * 输入前提示控件
 * @param {Object} cot
 * @param {Object} Doms	//对应已存在的 container, input, ddArrow, ddList
 * @param {Object} itemOverClass
 * @param {Object} itemOutClass
 * @param {Object} ddArrowDownClass
 * @param {Object} ddArrowUpClass
 */
FWK.UI.PromptInput = function(cot, Doms, itemOverClass, itemOutClass, ddArrowDownClass, ddArrowUpClass, ddListClass) {
	var me = this;
	this.isDDLOpen = false;
	
	this.setClass(itemOverClass, itemOutClass, ddArrowDownClass, ddArrowUpClass, ddListClass);
	
	var ddList = Doms&&Doms.ddList || document.createElement("div");
	if (ddListClass) {
		ddList.className = ddListClass;
	}
	
	ddList.listPromptData = function(value) {
//		this.$listPromptData;
		/*
		 * 原型方法与静态方法的转换
		 */
		me.$listPromptData(value);
		
		if (ddList.getItemCot().innerHTML=="") {
			ddList.getItemCot().innerHTML = "<div class='"+me.domClassName.itemOutClass+"'>没有符合条件的结果</div>";
		}
	}
	ddList.style.position = "absolute";
	var ddListItemCot = document.createElement("div");
	var ddListControl = document.createElement("div");
	ddListItemCot.getInstance = function() {
		return me;
	}
	ddListItemCot.setFocus = function(Itemdom) {
//		if (Itemdom instanceof FWK.UI.PromptInput.Item) {
		if (ddListItemCot.firstChild.nodeName!="#text") {
			this.focusItem = Itemdom;
		}		
//		}		
	}
	ddListItemCot.getFocus = function() {
		return this.focusItem;
	}
	
		
	ddList.appendChild(ddListItemCot);
	ddList.appendChild(ddListControl);
	ddList.getItemCot = function() {
		return ddListItemCot;
	}
	ddList.getControl = function() {
		return ddListControl;
	}
	
		
	var input = Doms&&Doms.input || document.createElement("input");
//	input.type = "text";
	input._timer = null;
	input.onkeydown = function(ev) {
		var evt = ev || window.event;
		var filterList = "16|17|18|36|35|9|37|39";		//过滤的按键	shift|ctrl|alt|home|end|tab|left|right
//		alert(evt.keyCode)		
		var evtKeyCode = evt.keyCode;
		var reg = "/\\b"+ evtKeyCode +"\\b/";
		
		if (filterList.match(eval(reg))) {
//			alert(evtKeyCode)
			return;
		} else if (evtKeyCode=='27') {	//ESC
			me.hideDDList();
			return false;
		} else if (evtKeyCode=='40') {	//up
			var p = (ddListItemCot.getFocus()&&ddListItemCot.getFocus().nextSibling) || ddListItemCot.firstChild;
			if (p) {
				FWK.UI.PromptInput.Item.onMsOv.apply(p);
			}
		} else if (evtKeyCode=='38') {	//down
			var p = (ddListItemCot.getFocus()&&ddListItemCot.getFocus().previousSibling) || ddListItemCot.lastChild;
			if (p) {
				FWK.UI.PromptInput.Item.onMsOv.apply(p);
			}			
		} else if (evtKeyCode=='13') {
			var p = (ddListItemCot.getFocus()&&ddListItemCot.getFocus());
			if (p) {
				FWK.UI.PromptInput.Item.onSelect.apply(p);
			}
		} else {
			if (input._timer != null) {
				clearTimeout(input._timer);
			}
			input._timer = setTimeout(doShowDDL ,300);
		}		
	}
	
	function doShowDDL() {
		me.showDDList();
		input._timer = null;
	}
	
	var container = Doms&&Doms.container || document.createElement("div");
	var ddArrow = Doms&&Doms.ddArrow || document.createElement("input");
	ddArrow.type = "button";
	ddArrow.onclick = function() {
		if (me.isDDLOpen) {
			me.hideDDList();
		} else {
			var evt = arguments[0] || window.event;
			try {
				evt.cancelBubble = true;
			}catch(ex) {}
						
			doShowDDL();
		}
	}
	
	container.appendChild(input);
	container.appendChild(ddArrow);
		
	this.Doms = {
		container: container,
		input: input,
		ddArrow: ddArrow,
		ddList: ddList
	}
	
	function hideDDList() {
		me.hideDDList();
	}
	
	try {
		document.body.attachEvent("onclick", hideDDList);
	} catch(ex) {
		document.body.addEventListener("click", hideDDList, false);
	}
	
	hideDDList();
	
	if (cot) {
		this.renderTo(cot);
	}
}
FWK.UI.PromptInput.prototype.getInput = function() {
	return this.Doms["input"];
}
FWK.UI.PromptInput.prototype.getDDList = function() {
	return this.Doms["ddList"];
}
FWK.UI.PromptInput.prototype.getPromptInput = function() {
	return this.Doms["container"];
}
FWK.UI.PromptInput.prototype.getDDArrow = function() {
	return this.Doms["ddArrow"];
}
FWK.UI.PromptInput.prototype.renderTo = function(cot) {
	cot.appendChild(this.getPromptInput());
}
FWK.UI.PromptInput.prototype.getInputValue = function() {
	return this.getInput().value.replace(/(^\s*)|(\s*$)/g, "");
}
FWK.UI.PromptInput.prototype.setInputValue = function(value) {
	this.getInput().value = value;
	
	try {
		this.$onSelect(value);
	} catch (ex) {		
	}
}
FWK.UI.PromptInput.prototype.$onSelect = function(value) {
	
}
FWK.UI.PromptInput.prototype.showDDList = function() {	
	var input = this.getInput();
	input.focus();
	var ddArrow = this.getDDArrow();
		
	var promptInput = this.getPromptInput();
	var pos = FWK.getDomCoord(promptInput);
	var ddListWidth = getPosition(input).w;		// + ddArrow.offsetWidth;
	var ddList = this.getDDList();
	
	if (!ddList.offsetParent) {
		document.body.appendChild(ddList);
	}

	var borderWidth = 0;
	if (!!document.all) {
		borderWidth = parseInt(ddList.currentStyle.borderLeftWidth) + parseInt(ddList.currentStyle.borderRightWidth);
	} else if (window.getComputedStyle) {
		borderWidth = parseInt(window.getComputedStyle(ddList, "").getPropertyValue("border-left-width")) +  parseInt(window.getComputedStyle(ddList, "").getPropertyValue("border-right-width"));;
	}
	
	borderWidth = parseInt(borderWidth);
	if (isNaN(borderWidth)) {
		borderWidth = 0;
	}
	
	ddList.style.top = pos.y + input.offsetHeight + "px";
	ddList.style.left = pos.x + "px";
	ddList.style.width = (ddListWidth - borderWidth) + "px";
	ddList.style.display = "";	
	ddList.getItemCot().innerHTML = value?"<div class='"+this.domClassName.itemOutClass+"'>正在筛选数据...</div>":"<div class='"+this.domClassName.itemOutClass+"'>请输入查询的内容</div>";

	var value = this.getInputValue();
	ddList.listPromptData(value);
	
	ddArrow.className = this.domClassName.ddArrowDownClass;
	
	this.isDDLOpen = true;
}
FWK.UI.PromptInput.prototype.hideDDList = function() {
	ddList = this.getDDList();
	ddList.style.display = "none";
	
	var ddArrow = this.getDDArrow();
	ddArrow.className = this.domClassName.ddArrowUpClass;
	
	this.isDDLOpen = false;
}
/**
 * 添加预选项
 * @param {Object} text
 * @param {Object} value
 */
FWK.UI.PromptInput.prototype.addDDListItem = function(text, value) {
	var itemCot = this.getDDList().getItemCot();
	var listItem = new FWK.UI.PromptInput.Item(text, value, itemCot);
	listItem.dom = this.$generateDDListItem(listItem);
	if (listItem.dom) {
		listItem.dom.setAttribute("value", value);
	}	
	listItem.init();
	return listItem.dom;
}
/**
 * 生成预选项
 * @param {FWK.UI.PromptInput.Item} listItem 
 */
FWK.UI.PromptInput.prototype.$generateDDListItem = function(listItem) {

}

/**
 * 根据返回结果循环列出预选项
 * @param {Object} data 输入框查询值
 */
FWK.UI.PromptInput.prototype.$listPromptData = function(data) {
//	console.innerHTML += data + "<br/>";
}

FWK.UI.PromptInput.prototype.setClass = function(itemOverClass, itemOutClass, ddArrowDownClass, ddArrowUpClass, ddListClass) {
	this.domClassName = {
		itemOverClass: itemOverClass?itemOverClass:"",
		itemOutClass: itemOutClass?itemOutClass:"",
		ddArrowDownClass: ddArrowDownClass?ddArrowDownClass:"",
		ddArrowUpClass: ddArrowUpClass?ddArrowUpClass:"",
		ddListClass: ddListClass?ddListClass:""
	}
}

/**
 * 预选项对象
 * @param {Object} text
 * @param {Object} value
 * @param {Object} renderCot
 */
FWK.UI.PromptInput.Item = function(text, value, renderCot) {
	this.text = text;
	this.value = value;
	this.renderCot = renderCot?renderCot:null;
	
	
	this.dom = null;
	
//	if (generateFun) {
//		this.$generateItemDom = generateFun;
//	}
	
//	this.init();
}

/*
 * 默认的生成DOM方法
 */
FWK.UI.PromptInput.Item.prototype.generateItemDom = function() {
	var dom = document.createElement("div");
	dom.appendChild(document.createTextNode(this.text));
	dom.setAttribute("value", this.value);
	
	this.dom = dom;
	return this.dom;
}
FWK.UI.PromptInput.Item.prototype.init = function() {	
	var dom = this.dom;
	
	if (!dom) {
		dom = this.generateItemDom();
	}
	
	dom.onmouseover = FWK.UI.PromptInput.Item.onMsOv; 	//this.onMsOv;
	dom.onmouseout = FWK.UI.PromptInput.Item.onMsOt; 	//this.onMsOt;
	dom.onclick = FWK.UI.PromptInput.Item.onSelect;  	//this.onSelect;		

	if (this.renderCot) {
		this.renderTo(this.renderCot);
	}
}
FWK.UI.PromptInput.Item.prototype.getDom = function() {
	return this.dom;
}
FWK.UI.PromptInput.Item.prototype.renderTo = function(cot) {
	var itemOutClass = cot.getInstance().domClassName.itemOutClass;
	this.dom.className = itemOutClass;
	
	cot.appendChild(this.dom);
	return this.dom;
}

FWK.UI.PromptInput.Item.onMsOv = function() {
	var ddListItemCot = this.parentNode;
	if (ddListItemCot.getFocus()) {
		ddListItemCot.getFocus().className = ddListItemCot.getInstance().domClassName.itemOutClass;
	}
	ddListItemCot.setFocus(this);
	if (ddListItemCot.getFocus()) {
		ddListItemCot.getFocus().className = ddListItemCot.getInstance().domClassName.itemOverClass;
	}
}
FWK.UI.PromptInput.Item.onMsOt = function() {
	
}
FWK.UI.PromptInput.Item.onSelect = function() {
	var ddListItemCot = this.parentNode;
	ddListItemCot.getInstance().setInputValue(this.getAttribute("value"));
	ddListItemCot.getInstance().hideDDList();
}
